<template>
	<div class="message-detail">
		<custom-header-bar bg="1" title="消息详情" backStatus="1"></custom-header-bar>
		<div class="container">
			<view scroll-y class="content-box">
				<div class="title">
					<span class="name">
						<span class="text">{{details.msgTypeName}}</span>
					</span>
					<span>{{details.msgTime}}</span>
				</div>
				<p class="content">
					{{details.msgContent}}
				</p>
			</view>
		</div>
	</div>
</template>
<script>
	import {
		getPrewarnDetail
	} from "@/api/message.js"
	export default {
		data() {
			return {
				details: {
					msgTypeName: '',
					msgTime: '',
					msgContent: ''
				}
			}
		},
		onLoad(options) {
			this.initData(options.id)
		},
		onShow() {
			uni.hideTabBar()
		},
		methods: {
			initData(id) {
				getPrewarnDetail({
					msgId: id
				}).then((res) => {
					this.details = res.data.data
				})
			}
		},
		computed: {

		},
		components: {
		}
	}
</script>

<style lang="scss">
	.message-detail {
		height: 100%;
		background-color: #F4f4f4;
		padding-top: 160upx;
		box-sizing: border-box;

		.container {
			height: 100%;
			padding: 24upx;
			box-sizing: border-box;

			.content-box {
				background-color: #ffffff;
				padding: 24upx;
				box-sizing: border-box;
				border-radius: 30upx;

				.title {
					display: flex;
					justify-content: space-between;

					.name {
						display: flex;
						justify-content: space-between;
						align-items: center;
					}
				}

				.content {
					margin-top: 24upx;
					color: #000000A6;
					font-size: 24upx;
				}
			}
		}
	}
</style>
